<!-- public/index.html -->
<!DOCTYPE html>
<html>
<head>
  <title>PDF生成器 - 支持远程URL</title>
  <link rel="stylesheet" href="/css/style.css">
</head>
<body>
  <div class="container">
    <h1>PDF文档生成器</h1>
    <p>支持从HTML、模板和远程URL生成PDF</p>
    
    <div class="tabs">
      <button class="tab-btn" data-tab="url">URL生成</button>
      <button class="tab-btn" data-tab="html">HTML生成</button>
      <button class="tab-btn" data-tab="template">模板生成</button>
    </div>
    
    <div class="tab-content active" id="url-tab">
      <h3>从远程URL生成PDF</h3>
      <input type="url" id="url-input" placeholder="输入完整的URL (https://...)" style="width: 100%; padding: 10px; margin: 10px 0;">
      <div>
        <button onclick="generateFromURL()">生成PDF</button>
        <button onclick="previewFromURL()">预览PDF</button>
        <button onclick="screenshotURL()">网页截图</button>
        <button onclick="getPageInfo()">获取页面信息</button>
      </div>
      <div id="url-preview"></div>
    </div>
    
    <div class="tab-content" id="html-tab">
      <h3>从HTML生成PDF</h3>
      <textarea id="html-input" placeholder="输入HTML内容..." style="width: 100%; height: 200px;"></textarea>
      <button onclick="generateFromHTML()">生成PDF</button>
      <button onclick="previewFromHTML()">预览PDF</button>
    </div>
    
    <div class="tab-content" id="template-tab">
      <h3>从模板生成PDF</h3>
      <select id="template-select">
        <option value="">选择模板</option>
      </select>
      <textarea id="template-data" placeholder='{"key": "value"}' style="width: 100%; height: 100px;"></textarea>
      <button onclick="generateFromTemplate()">生成PDF</button>
      <button onclick="previewFromTemplate()">预览PDF</button>
    </div>
  </div>

  <script src="/js/script.js"></script>
</body>
</html>
